<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="单据编号">
              <j-input placeholder="请输入单据编号" v-model="queryParam.billNo"></j-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="费用类型">
              <j-dict-select-tag
                placeholder="请选择费用类型"
                v-model="queryParam.feeCategory"
                dictCode="fee_category_project"
              />
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="申请人">
              <select-user-by-dep :multi="false" v-model="queryParam.proposer"></select-user-by-dep>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="汇款公司">
              <select-Company-input  v-model="queryParam.remittanceUnit" placeholder="请选择汇款公司" />
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="保证金所属团队">
              <select-team-input v-model="queryParam.teamId" :tdlx="3" />
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="收款单位名称">
              <j-input placeholder="请输入收款单位名称" v-model="queryParam.payeeUnit"></j-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="关联项目">
              <select-project-input v-model="queryParam.preProjectId" placeholder="请输入选择项目" />
            </a-form-item>
          </a-col><a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="保证金金额">
              <a-input-number
                placeholder="请输入最小值"
                class="query-group-cust"
                :precision="2"
                v-model="queryParam.remittanceAmount_begin"
                style="width: calc(50% - 15px)"
              ></a-input-number>
              <span class="query-group-split-cust"></span>
              <a-input-number
                placeholder="请输入最大值"
                class="query-group-cust"
                :precision="2"
                :min="queryParam.remittanceAmount_begin"
                v-model="queryParam.remittanceAmount_end"
                style="width: calc(50% - 15px)"
              ></a-input-number>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="保函金额">
              <a-input-number
                placeholder="请输入最小值"
                class="query-group-cust"
                :precision="2"
                v-model="queryParam.letterAmount_begin"
                style="width: calc(50% - 15px)"
              ></a-input-number>
              <span class="query-group-split-cust"></span>
              <a-input-number
                placeholder="请输入最大值"
                class="query-group-cust"
                :precision="2"
                :min="queryParam.letterAmount_begin"
                v-model="queryParam.letterAmount_end"
                style="width: calc(50% - 15px)"
              ></a-input-number>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="汇款截止时间">
              <j-date placeholder="请选择汇款截止时间" v-model="queryParam.remittanceEndTime" style="width: 100%" />
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="是否归还">
              <j-dict-select-tag placeholder="请选择是否归还" v-model="queryParam.isReturn" dictCode="is_pay_flag" />
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="收款单单号">
              <j-input placeholder="请输入收款单单号" v-model="queryParam.collectBillNo"></j-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="回款金额">
              <a-input-number
                placeholder="请输入最小值"
                class="query-group-cust"
                :precision="2"
                v-model="queryParam.collectAmount_begin"
                style="width: calc(50% - 15px)"
              ></a-input-number>
              <span class="query-group-split-cust"></span>
              <a-input-number
                placeholder="请输入最大值"
                class="query-group-cust"
                :precision="2"
                :min="queryParam.collectAmount_begin"
                v-model="queryParam.collectAmount_end"
                style="width: calc(50% - 15px)"
              ></a-input-number>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="CBS银行流水号">
              <j-input placeholder="请输入CBS银行流水号" v-model="queryParam.bankTransNo"></j-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->

    <!-- 操作按钮区域 -->
    <div class="table-operator">
      <a-button type="primary" icon="download" @click="handleExportXls('保证金台账')">导出</a-button>
      <!-- <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
        <a-button type="primary" icon="import" :disabled="isDisabledAuth('erpFinanceProjectDepositBill:import')">导入</a-button>
      </a-upload> -->
      <!-- 高级查询区域 -->
      <!--<j-super-query :fieldList="superFieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query>-->
      <!--      <a-dropdown v-if="selectedRowKeys.length > 0">-->
      <!--        <a-menu slot="overlay">-->
      <!--          <a-menu-item key="1" @click="batchDel" :disabled="isDisabledAuth('erpFinanceProjectDepositBill:delete')"><a-icon type="delete"/>删除</a-menu-item>-->
      <!--        </a-menu>-->
      <!--        <a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>-->
      <!--      </a-dropdown>-->
      <a-popover title="自定义列" trigger="click" placement="leftBottom">
        <template slot="content">
          <a-checkbox-group @change="onColSettingsChange" v-model="settingColumns" :defaultValue="settingColumns">
            <a-row>
              <template v-for="(item, index) in defColumns">
                <template v-if="item.key != 'rowIndex' && item.dataIndex != 'action'">
                  <a-col :span="12"
                    ><a-checkbox
                      :value="item.dataIndex"
                      :disabled="item.checkStatus == '2' || item.bpmStatus == 3 ? true : false"
                      >{{ item.title }}</a-checkbox
                    ></a-col
                  >
                </template>
              </template>
            </a-row>
          </a-checkbox-group>
        </template>
        <a style="float: right"><a-icon type="setting" :style="iconStyle" /></a>
      </a-popover>
    </div>

    <!-- table区域-begin -->
    <div>
      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px">
        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择
        <a style="font-weight: 600">{{ selectedRowKeys.length }}</a
        >项
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
      </div>

      <a-table
        ref="table"
        size="middle"
        :scroll="{ x: scrollX }"
        :components="draggableComponent"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
        class="j-table-force-nowrap"
        :customRow="customRow"
        @change="handleTableChange"
      >
        <a slot="serviceCharge" slot-scope="text, record" @click="getServiceCharge(record)">{{ text }}</a>
        <a slot="preProjectId" slot-scope="text, record" @click="onDetail(record.preProjectId)">{{ text }}</a>
        <a slot="returnAmount" slot-scope="text, record" @click="getdepositReturnMoney(record)">{{ text }}</a>
        <a slot="billNo" slot-scope="text, record" @click="getDetail(record.id)">{{ text }}</a>
    
        <span slot="action" slot-scope="text, record">
          <template v-if="record.bpmStatus !== '1'">
            <a-button
              type="primary"
              size="small"
              @click="handleTrack(record)"
              :disabled="isDisabledAuth('erpFinanceProjectDepositBill:viewTrack')"
              >审批进度</a-button>
          </template>
        </span>
      </a-table>
    </div>

    <ErpFinanceReimbursementRelDepositBillListPenetrate
      ref="depositReimbursementBillList"
    ></ErpFinanceReimbursementRelDepositBillListPenetrate>
    <ErpProjectFinanceDepositReturnMoneyPenetrate
      ref="depositReturnMoney"
    ></ErpProjectFinanceDepositReturnMoneyPenetrate>
    <erp-finance-project-deposit-bill-modal ref="modalForm" @ok="modalFormOk"></erp-finance-project-deposit-bill-modal>
    <bpm-biz-task-deal-modal
      ref="taskDealModal"
      :path="path"
      :formData="formData"
      @ok="handleOk"
    ></bpm-biz-task-deal-modal>
    <bpm-process-track-modal ref="bpmProcessTrackModal"></bpm-process-track-modal>
    <biz-task-notify-modal ref="taskNotifyModal"></biz-task-notify-modal>
    <biz-task-notify-me-modal ref="taskNotifyMeModal"></biz-task-notify-me-modal>
    <process-config-modal ref="processConfig" @ok="handleSuccess" @close="handleClose"></process-config-modal>
    <!-- 项目详情开始 -->
    <erp-project-report-modal ref="projectReport"></erp-project-report-modal>
    <!-- 项目详情结束 -->
  </a-card>
</template>

<script>
import '@/assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { JeecgBpmListMixin } from '@/mixins/JeecgBpmListMixin'
import BpmBizTaskDealModal from '@/views/modules/bpmbiz/common/BpmBizTaskDealModal.vue'
import BpmProcessTrackModal from '@/views/modules/bpmbiz/common/BpmProcessTrackModal.vue'
import BizTaskNotifyModal from '@/views/modules/bpmbiz/common/BizTaskNotifyModal.vue'
import BizTaskNotifyMeModal from '@/views/modules/bpmbiz/common/BizTaskNotifyMeModal.vue'
import ErpFinanceProjectDepositBillModal from './modules/ErpFinanceProjectDepositBillModal'
import { getAction } from '@/api/manage'
import SelectTeamInput from '@/views/scy/components/SelectTeamInput'
import { filterMultiDictText, initDictOptions } from '@/components/dict/JDictSelectUtil'
import { DisabledAuthFilterMixin } from '@/mixins/DisabledAuthFilterMixin'
import SelectCustomerInput from '@/views/scy/components/SelectCustomerInput'
import SelectProjectInput from '@/views/scy/components/SelectProjectInput'
import ProcessConfigModal from '@/views/scy/components/ProcessConfigModal'
import SelectUserByDep from '@/views/scy/components/SelectUserByDep'
import SelectCompanyInput from '@/views/scy/components/SelectCompanyInput'


export default {
  name: 'ErpFinanceProjectDepositBillList',
  mixins: [JeecgBpmListMixin, mixinDevice, DisabledAuthFilterMixin],
  components: {
    ErpFinanceProjectDepositBillModal,
    BpmBizTaskDealModal,
    BpmProcessTrackModal,
    BizTaskNotifyModal,
    BizTaskNotifyMeModal,
    SelectCustomerInput,
    SelectProjectInput,
    ProcessConfigModal,
    SelectUserByDep,
    SelectTeamInput,
    SelectCompanyInput,
    ErpFinanceReimbursementRelDepositBillListPenetrate: () =>
      import('@/views/scy/penetrate/ErpFinanceReimbursementRelDepositBillListPenetrate'),
    ErpProjectFinanceDepositReturnMoneyPenetrate: () =>
      import('@/views/scy/penetrate/ErpProjectFinanceDepositReturnMoneyPenetrate'),
    ErpProjectReportModal: () => import('@/views/erp/report/project/modules/ErpProjectReportModal'),
  },
  data() {
    return {
      description: '项目保证金申请单管理页面',
      //表头
      columns: [],
      //列设置
      settingColumns: [],
      dictOptions: {},
      projectType: '1',
      // 列定义
      defColumns: [
        {
          title: '序号',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        {
          title: '单据编号',
          align: 'center',
          dataIndex: 'billNo',
          scopedSlots: { customRender: 'billNo' },
          ellipsis: true,
          width: 155,
        },
        {
          title: '申请人',
          align: 'center',
          dataIndex: 'proposer_dictText',
          width: 150,
          ellipsis: true,
        },
        {
          title: '申请部门',
          align: 'center',
          dataIndex: 'proposerDeptId_dictText',
          width: 150,
          ellipsis: true,
        },
        {
          title: '汇款单位名称',
          align: 'center',
          dataIndex: 'remittanceUnit_dictText',
          width: 155,
          ellipsis: true,
        },
        {
          title: '保证金所属团队',
          align: 'center',
          dataIndex: 'teamId_dictText',
          width: 155,
          ellipsis: true,
        },
        {
          title: '项目档案编号',
          align: 'center',
          dataIndex: 'projectCode',
          width: 155,
          ellipsis: true,
        },
        {
          title: '关联项目',
          align: 'center',
          dataIndex: 'preProjectId_dictText',
          scopedSlots: { customRender: 'preProjectId' },
          width: 155,
          ellipsis: true,
        },
        {
          title: '项目承接人',
          align: 'center',
          dataIndex: 'projectUndertaker_dictText',
          width: 155,
          ellipsis: true,
        },
        {
          title: '收款单位名称',
          align: 'center',
          dataIndex: 'payeeUnit',
          width: 155,
          ellipsis: true,
        },
        {
          title: '费用类型',
          align: 'center',
          dataIndex: 'feeCategory_dictText',
          width: 155,
          ellipsis: true,
        },
        {
          title: '保证金金额(元)',
          align: 'center',
          dataIndex: 'remittanceAmount',
          width: 155,
          ellipsis: true,
        },
        {
          title: '保函金额(元)',
          align: 'center',
          dataIndex: 'letterAmount',
          width: 155,
          ellipsis: true,
        },
        {
          title: '服务费(元)',
          align: 'center',
          dataIndex: 'serviceCharge',
          scopedSlots: { customRender: 'serviceCharge' },
          width: 155,
          ellipsis: true,
        },
        {
          title: '利息金额(元)',
          align: 'center',
          dataIndex: 'interestAmount',
          width: 155,
          ellipsis: true,
        },
        {
          title: '归还金额(元)',
          align: 'center',
          dataIndex: 'returnAmount',
          scopedSlots: { customRender: 'returnAmount' },
          width: 155,
          ellipsis: true,
        },
        {
          title: '未还金额(元)',
          align: 'center',
          dataIndex: 'unreturnAmount',
          width: 155,
          ellipsis: true,
        },
        {
          title: '是否归还',
          align: 'center',
          dataIndex: 'isReturn_dictText',
          width: 155,
          ellipsis: true,
        },
        {
          title: '汇款截止时间',
          align: 'center',
          dataIndex: 'remittanceEndTime',
          customRender: function (text) {
            return !text ? '' : text.length > 10 ? text.substr(0, 10) : text
          },
          ellipsis: true,
          width: 155,
        },
        {
          title: '预计返款时间',
          align: 'center',
          dataIndex: 'estimateRefundTime',
          customRender: function (text) {
            return !text ? '' : text.length > 10 ? text.substr(0, 10) : text
          },
          ellipsis: true,
          width: 155,
        },
        {
          title: '收款单单号',
          align: 'center',
          dataIndex: 'collectBillNo',
          ellipsis: true,
          width: 155,
        },
        {
          title: '回款金额(元)',
          align: 'center',
          dataIndex: 'collectAmount',
          width: 155,
          ellipsis: true,
        },
        {
          title: '汇款日期',
          align: 'center',
          dataIndex: 'remittanceDate',
          customRender: function (text) {
            return !text ? '' : text.length > 10 ? text.substr(0, 10) : text
          },
          ellipsis: true,
          width: 155,
        },
        {
          title: 'CBS银行流水号',
          align: 'center',
          dataIndex: 'bankTransNo',
          ellipsis: true,
          width: 155,
        },
        {
          title: '流程状态',
          align: 'center',
          dataIndex: 'bpmStatus_dictText',
          ellipsis: true,
          width: 155,
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: 'center',
          fixed: 'right',
          width: 160,
          scopedSlots: {
            filterDropdown: 'filterDropdown',
            filterIcon: 'filterIcon',
            customRender: 'action',
          },
        },
      ],
      url: {
        queryProjectReportById: '/api/erp/project/report/erpProjectReport/queryById',
        list: '/api/erp/finance/deposit/erpFinanceProjectDepositBill/docList?bpmStatus=3',
        delete: '/api/erp/finance/deposit/erpFinanceProjectDepositBill/delete',
        deleteBatch: '/api/erp/finance/deposit/erpFinanceProjectDepositBill/deleteBatch',
        exportXlsUrl: '/api/erp/finance/deposit/erpFinanceProjectDepositBill/exportDocXls',
        importExcelUrl: 'api/erp/finance/deposit/erpFinanceProjectDepositBill/importExcel',
        bizCount: '/api/erp/finance/deposit/erpFinanceProjectDepositBill/bizCount',
      },
      //代码生成后需手动设置流程编码
      flowCode: 'onl_erp_finance_project_deposit_bill',
      formUrl: '/erp/finance/deposit/modules/ErpFinanceProjectDepositBillForm',
      formUrlMobile: '/pages/synergy/erpFinanceProjectDepositBillList',
      dictOptions: {},
      superFieldList: [],
      processId: '1521678235605229569',
      beanName: 'erpFinanceProjectDepositBillServiceImpl',
    }
  },
  created() {
    this.getSuperFieldList()
    //加载数据字典信息
    // this.initDictConfig();
  },
  computed: {
    importExcelUrl: function () {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
    },
  },
  methods: {
    getServiceCharge(record) {
      //先清空数据
      this.$refs.depositReimbursementBillList.dataSource = []
      this.$refs.depositReimbursementBillList.ipagination.total = 0
      //查询数据
      this.$refs.depositReimbursementBillList.loading = true
      this.$refs.depositReimbursementBillList.relBillId = record.id
      this.$refs.depositReimbursementBillList.searchResets()
      //打开弹窗
      this.$refs.depositReimbursementBillList.visible = true
    },
    //打开归还金额
    getdepositReturnMoney(record) {
      //先清空数据
      this.$refs.depositReturnMoney.dataSource = []
      this.$refs.depositReturnMoney.ipagination.total = 0
      //查询数据
      this.$refs.depositReturnMoney.loading = true
      this.$refs.depositReturnMoney.depositId = record.id
      if (record.isTransform === '1') {
        this.$refs.depositReturnMoney.isTrue = true
        this.$refs.depositReturnMoney.relDepositBill = record.id
      } else {
        this.$refs.depositReturnMoney.isTrue = false
        this.$refs.depositReturnMoney.relDepositBill = null
      }
      this.$refs.depositReturnMoney.activeKey = '1'
      this.$refs.depositReturnMoney.searchReset()
      //打开弹窗
      this.$refs.depositReturnMoney.visible = true
    },
    onDetail(id) {
      const that = this
      this.$nextTick(() => {
        getAction(this.url.queryProjectReportById, { id }).then((res) => {
          if (res.success) {
            const model = res.result
            that.$refs.projectReport.getDetail(model)
            that.$refs.projectReport.title = '项目一览表'
          }
        })
      })
    },
    //发起流程
    beginProcess(record) {
      this.$refs.processConfig.visible = true
      this.$refs.processConfig.formUrl = this.formUrl
      this.$refs.processConfig.formUrlMobile = this.formUrlMobile
      this.$refs.processConfig.flowCode = this.flowCode
      this.$refs.processConfig.edit(record, '', this.beanName)
    },
    handleSuccess() {
      this.loadData()
      this.onClearSelected()
      this.$refs.modalForm.handleCancel()
    },
    // 新增流程取消关闭弹窗刷新页面
    handleClose() {
      this.$refs.modalForm.handleCancel()
      this.loadData()
    },
    //流程审批结束禁用
    getCheckboxProps(record) {
      return {
        props: {
          disabled: record.bpmStatus !== '1',
        },
      }
    },
    // table 双击查看详情
    customRow(record) {
        return {
          on: {
            // 事件
            dblclick: event => {
              this.$router.push({
                path: `/erp/finance/deposit/ErpFinanceProjectDepositBillListDetail/${record.id}`,
              })
            }
          }
        }
      },
    //加载数据字典信息
    initDictConfig() {},
    //查看详情
    getDetail(id) {
      this.$router.push({
        path: `/erp/finance/deposit/ErpFinanceProjectDepositBillListDetail/${id}`,
      })
    },
    getSuperFieldList() {
      let fieldList = []
      fieldList.push({ type: 'string', value: 'handlerId', text: '经办人编号', dictCode: '' })
      fieldList.push({ type: 'string', value: 'handlerDeptId', text: '经办人部门ID', dictCode: '' })
      fieldList.push({ type: 'string', value: 'handlerDeptCode', text: '经办人部门编码', dictCode: '' })
      fieldList.push({ type: 'string', value: 'delFlag', text: '是否已删除', dictCode: '' })
      fieldList.push({ type: 'string', value: 'billNo', text: '单据编号', dictCode: '' })
      fieldList.push({ type: 'string', value: 'applicant', text: '申请公司', dictCode: '' })
      fieldList.push({ type: 'string', value: 'teamId', text: '保证金所属团队', dictCode: '' })
      fieldList.push({ type: 'string', value: 'projectUndertaker', text: '项目承接人', dictCode: '' })
      fieldList.push({ type: 'string', value: 'preProjectId', text: '预立项项目名称', dictCode: '' })
      fieldList.push({ type: 'string', value: 'remittanceUnit', text: '汇款单位名称', dictCode: '' })
      fieldList.push({ type: 'date', value: 'remittanceEndTime', text: '汇款截止时间' })
      fieldList.push({ type: 'string', value: 'feeCategory', text: '费用类型', dictCode: '' })
      fieldList.push({ type: 'string', value: 'remittanceAccountRequirements', text: '汇款账户要求', dictCode: '' })
      fieldList.push({ type: 'string', value: 'remittanceMode', text: '汇款方式', dictCode: '' })
      fieldList.push({ type: 'BigDecimal', value: 'remittanceAmount', text: '付款金额', dictCode: '' })
      fieldList.push({ type: 'string', value: 'payeeUnit', text: '收款单位名称', dictCode: '' })
      fieldList.push({ type: 'string', value: 'payeeBankName', text: '收款方开户行', dictCode: '' })
      fieldList.push({ type: 'string', value: 'payeeAccountNo', text: '收款方账户', dictCode: '' })
      fieldList.push({ type: 'string', value: 'payeeContacts', text: '收款联系人', dictCode: '' })
      fieldList.push({ type: 'string', value: 'payeeContactInfo', text: '收款联系方式', dictCode: '' })
      fieldList.push({ type: 'date', value: 'estimateRefundTime', text: '预计返款时间' })
      fieldList.push({ type: 'string', value: 'remark', text: '备注', dictCode: '' })
      fieldList.push({ type: 'Text', value: 'attachments', text: '附件', dictCode: '' })
      fieldList.push({ type: 'int', value: 'checkStatus', text: '审核状态', dictCode: '' })
      fieldList.push({ type: 'string', value: 'bpmStatus', text: '流程状态', dictCode: '' })
      this.superFieldList = fieldList
    },
  },
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
